@extends('layouts.default')
@section('main')
<script type="text/javascript" src="{{URL::asset('js/')}}/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="{{URL::asset('js/')}}/hightcharts/highcharts.js"></script>
<script type="text/javascript">
//图表属性，不包含数据
var options = {
	chart: {
		renderTo:'container',
		type:'spline',
	},
	title: {
		text: '实时温度曲线',
		x: -20 //center
	},
	xAxis:{
		
	},
	yAxis: {
		title: {
			text: 'Temperature (°C)'
		},
		plotLines: [{
			value: 0,
			width: 1,
			color: '#808080'
		}]
	},
	series: [{
		name:'温度',
	}],
	tooltip: {
		valueSuffix: '°C'
	},
	plotOptions: {
	    spline:{
	    	dataLabels: {
				enabled: true
        	},
        animation:false,
      },
	},
};

//初始函数，设置定时器，定时取数据
$(function () {
	queryData();
});

var categories = [];
var datas = [];

//Ajax 获取数据并解析创建Highcharts图表
function queryData() {
	$.ajax({
		url:'/home/test',
		dataType:"json",
		success:function(data) {
			$.each(data,function(i,n){
				categories[i] = n[0];
				datas[i] = n[1]*1;
			});
			options.xAxis.categories = categories;
			options.series[0].data = datas;
				
			chart = new Highcharts.Chart(options);
 		}
	});
}
</script>
<div id="content">
<!--breadcrumbs-->
  <div id="content-header">
    <div id="breadcrumb"> <a href="{{url('home')}}" title="Go to Home" class="tip-bottom"><i class="icon-home"></i> Home</a></div>
  </div>
<!--End-breadcrumbs-->

<!--Action boxes-->
  <div class="container-fluid">
    <div class="quick-actions_homepage">
      <ul class="quick-actions">
        <li class="bg_lb"> <a href="{{url('home').'?submodule_id=4'}}"> <i class="icon-dashboard"></i>无界投融 </a> </li>
      </ul>
        {{--<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>--}}
    </div>
</div>
</div>
@stop
